<template lang="pug">
  .page
    .search-form.mb-10.pl-10.pr-10
      Row(type="flex" justify="start" v-if='hasCustomerList')
        Col.pr-20.mb-15(span="7")
          span.label-txt.w110 客户名称：
          Input(v-model="customerName" placeholder="请输入" clearable)
        Col.pr-20.mb-15(:md="{ span: 12 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 6}")
          span.label-txt.w80 所属客服：
          Select(v-model="serverId" placeholder="请选择所属客服" filterable clearable)
            Option(v-for="(item, index) in serverId_arr" :value="item.key" :key="index") {{ item.value }}
        Col.pr-20.mb-15(:md="{ span: 12 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 6}")
          span.label-txt.w80 合作类型：
          Select(v-model="cooperateType" placeholder="请选择合作类型" clearable)
            Option(v-for="(item, index) in cooperateType_arr" :value="item.key" :key="index") {{ item.value }}
        Col.pr-20.mb-15(:md="{ span: 12 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 6}")
          span.label-txt.w80 合作关系：
          Select(v-model="cooperateStatus"  placeholder="请选择合作关系" clearable)
            Option(v-for="(item, index) in cooperateStatuseType_arr" :value="item.key" :key="index") {{ item.value }}
          //- Col.pr-20.mb-15(:md="{ span: 12 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 6}")
          //-   span.label-txt.w80 上级公司：
          //-   Select(v-model="superCompanyId"  placeholder="请选择上级公司" clearable)
          //-     Option(v-for="(item, index) in superCompanyId_arr" :value="item.key" :key="index") {{ item.value }}
          Button.ml-10(type="info" @click="searchBtn") 查询
    .pl-20.pr-20.bg-white
      Table.hasTitle-table.beautiful-table(width="100%" :loading="loading" stripe :columns="thead" :data="listData" @on-selection-change="tableSelectChange")
        .pr-24.pl-24(slot="header")
          .table-title-lefttxt.pull-left
            span
              |合计:
              span.text-info.pl-5.pr-5.font-weight {{codeTotal}}
              | 条
          .pull-right.table-title-btns
            Button.mr-15(type="info" v-if='hasAddPermission' @click="handleBatchDealModal('add')") 批量添加数据权限
            Button.mr-15(type="info" v-if='hasDeletePermission' @click="handleBatchDealModal('del')") 批量删除数据权限
            Button.mr-15(type="info" v-if='hasCopyCustomerPermission' @click="handleCopyModal()") 复制其他客户权限
        template(slot-scope="{ row, index }" slot="action")
          Button.mr-5(type="text" size="small" v-if='hasCustomerPermission' @click="handleShowDetailModal(row.id, row.name)") 详情
        .clearfix.pl-20.pr-20(slot="footer")
          Page(:total="codeTotal" :current="PageIndex" :page-size="PageSize" prev-text="上一页" next-text="下一页" @on-change="pageChangeFn" show-total @on-page-size-change="onpageSizeChange" show-sizer :page-size-opts="[10, 20, 30, 50, 100]")

      //- 详情弹窗
      ShowDetailModal(ref="ShowDetailModal")
      //- 复制权限弹窗
      CopyModal(ref="CopyModal")
      //- 批量处理弹窗
      BatchDealModal(ref="BatchDealModal")
</template>

<script>
import filesManageApi from '@/api/filesManage.api.js'
import { SysDataPermissionApi } from '@/api/SysDataPermission.api.js'
import dataApi from '@/api/data.js'
import config from '@/config'
import ShowDetailModal from './modal/ShowDetailModal.vue'
import CopyModal from './modal/CopyModal.vue'
import BatchDealModal from './modal/BatchDealModal.vue'
import { constants } from 'fs';
const baseUrl = process.env.NODE_ENV === 'development' ? config.baseUrl.dev : config.baseUrl.pro

export default {
  name: 'customerAuthority',
  components: {
    ShowDetailModal,
    CopyModal,
    BatchDealModal
  },
  data () {
    return {
      uploadBaseUrl: baseUrl,
      thead: [
        {
          type: 'selection',
          width: 60,
          fixed: 'left',
          align: 'center'
        },
        {
          title: '客户名称',
          minWidth: 100,
          key: 'name'
        },
        {
          title: '所属客服',
          minWidth: 100,
          key: 'serverName'
        },
        {
          title: '合作类型',
          minWidth: 100,
          key: 'typeName'
        },
        {
          title: '上级公司',
          minWidth: 100,
          key: 'parentCompanyName',
          render: (h, params) => {
            let row = params.row
            let parentCompanyName = params.row.parentCompanyName ? params.row.parentCompanyName : '-'
            return h('span', parentCompanyName)
          }
        },
        {
          title: '合作关系',
          minWidth: 100,
          key: 'statusName'
        },
        {
          title: '操作',
          minWidth: 100,
          slot: 'action'
        }
      ],
      listData: [],
      customerName: '', // 公司名称
      idArr: [],
      loading: false,
      PageIndex: 1,
      PageSize: 10,
      codeTotal: 0,
      serverId_arr: [], // 所属客服
      serverId: '', // 查询所属客服值
      cooperateType_arr: [], // 合作类型
      cooperateType: '', // 合作类型值
      cooperateStatuseType_arr: [], // 合作状态
      cooperateStatus: '', // 合作状态值
      superCompanyId:'', //上级公司值
      superCompanyId_arr: [], // 上级公司
    }
  },
  // mixins: [Mixin, theadMixin],
  computed: {
    actionArr () {
      let arr = this.$store.state.user.actionAccess.map(item => {
        return item.code
      })
      return arr
    },
    // 查询
    hasCustomerList () {
      return this.actionArr.indexOf('CustomerList') > -1
    },
    // 详情
    hasCustomerPermission () {
      return this.actionArr.indexOf('CustomerPermission') > -1
    },
    // 批量添加数据权限
    hasAddPermission () {
      return this.actionArr.indexOf('AddPermission') > -1
    },
    // 批量删除数据权限
    hasDeletePermission () {
      return this.actionArr.indexOf('DeletePermission') > -1
    },
    // 复制其他数据权限
    hasCopyCustomerPermission () {
      return this.actionArr.indexOf('CopyCustomerPermission') > -1
    }
  },
  created () {
    this.getEnum()
    // this.getCompany()
    this.serverDown()
    this.getList()
  },
  watch: {
    $route (to, from) {
      if (to.name === 'contract-files') {
        this.getList()
      }
    }
  },
  methods: {
    getServerArr () {
      return this.serverId_arr
    },
    getXooperateTypeArr () {
      return this.cooperateType_arr
    },
    // 获取上级公司
    getCompany () {
      dataApi.postCompanys({
        PageIndex: 1,
        PageSize: 10000
      }).then((res) => {
        this.superCompanyId_arr = res.data[0].items
      })
    },
    /**
     * server所属客服下拉数据
     */
    serverDown () {
      let data = {
        pageIndex: 1,
        pageSize: 1000
      }
      dataApi.postServers(data).then(res => {
        this.serverId_arr = res.data[0].items
      })
    },

    /**
     * 数据字典
     */
    getEnum () {
      let groupNames = 'customer.type,customer.status'
      dataApi.getEnum({
        groupName: groupNames
      }).then((res) => {
        this.cooperateType_arr = this.getItems(res.data, 'customer.type')
        this.cooperateStatuseType_arr = this.getItems(res.data, 'customer.status')
      })
    },
    getItems (arr, key) {
      let object = arr.find((item) => {
        return item.group === key
      })
      return object.items
    },
    // 获取客户列表
    getList () {
      this.loading = true
      SysDataPermissionApi.getCustomerList({
        Name: this.customerName,
        ServerId: this.serverId,
        CooperateType: this.cooperateType,
        CooperateStatus: this.cooperateStatus,
        PageIndex: this.PageIndex,
        PageSize: this.PageSize
      }).then(res => {
        this.loading = false
        if (res.data.success) {
          this.listData = res.data.data
          this.codeTotal = res.data.totalRows
        } else {
          this.$Message.error({
            content: res.data.message,
            duration: 10,
            closable: true
          })
        }
      })
    },
    // 获取详情
    handleShowDetailModal (id, customerName) {
      this.$refs.ShowDetailModal.isShowDetailModal = true
      this.$refs.ShowDetailModal.id = id
      this.$refs.ShowDetailModal.customerName = customerName
      this.$refs.ShowDetailModal.PageIndex = 1
      this.$refs.ShowDetailModal.getList()
      console.log()
    },
    
    // 复制权限弹窗
    handleCopyModal () {
      console.log(this.idArr, 'this.idArr')
      if (this.idArr.length > 0) {
        this.$refs.CopyModal.copyID = ''
        this.$refs.CopyModal.isCopyModal = true
        this.$refs.CopyModal.idArr = this.idArr
        this.$refs.CopyModal.serverDown()
      } else {
        this.$Message.warning('请选择需要复制权限的客户')
      }
    },

    // 批量处理弹窗
    handleBatchDealModal (type) {
      if (this.idArr.length > 0) {
        this.$refs.BatchDealModal.targetKeys = []
        this.$refs.BatchDealModal.treeCheckList = []
        this.$refs.BatchDealModal.contractRadio = ''
        this.$refs.BatchDealModal.groupID = ''
        this.$refs.BatchDealModal.isBatchDealModal = true
        this.$refs.BatchDealModal.type = type
        this.$refs.BatchDealModal.customerIdList = this.idArr
        this.$refs.BatchDealModal.serverDown()
        this.$refs.BatchDealModal.getPermissionGroup()
      } else {
        this.$Message.warning('请选择需要批量处理的客户')
      }
      
    },
    
    // 查询
    searchBtn () {
      this.PageIndex = 1
      this.getList()
    },
    tableSelectChange (val) {
      this.idArr = val.map(item => {
        return item.id
      })
    },
    pageChangeFn (val) {
      this.PageIndex = val
      this.getList()
    },
    onpageSizeChange (val) {
      this.PageSize = val
      this.getList()
    }
  }
}
</script>

<style>

</style>
